<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:mo="https://gitee.com/aun/Timo">
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
</head>
<body class="timo-layout-page">
    <div class="layui-card">
        <div class="layui-card-header timo-card-header">
            <span><i class="fa fa-bars"></i> 店铺管理</span>
            <i class="layui-icon layui-icon-refresh refresh-btn"></i>
        </div>
        <div class="layui-card-body">
            <div class="layui-row timo-card-screen">
                <div class="pull-left layui-form-pane timo-search-box">
                    <div class="layui-inline">
                        <label class="layui-form-label">店铺名称</label>
                        <div class="layui-input-block">
                            <input type="text" name="shopName" th:value="${param.shopName}" placeholder="请输入店铺名称" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">位置</label>
                        <div class="layui-input-block">
                            <cascader id="demo1"></cascader>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn" id="searchBtn">
                            <i class="fa fa-search"></i>
                        </button>
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn" id="refreshBtn">
                            <i class="fa fa-refresh"></i>
                        </button>
                    </div>
                </div>
                <div class="pull-right screen-btn-group">
                    <button class="layui-btn open-popup" data-title="添加店铺" th:attr="data-url=@{/shopsService/shops/add}" data-size="35-70">
                        <i class="fa fa-plus"></i> 添加</button>
                </div>
            </div>
            <div class="timo-table-wrap">
                <table class="layui-table timo-table">
                    <thead>
                    <tr>
                        <th class="timo-table-checkbox">
                            <label class="timo-checkbox"><input type="checkbox">
                                <i class="layui-icon layui-icon-ok"></i></label>
                        </th>
                        <th>店铺名称</th>
                        <th>店铺类型</th>
                        <th>联系人名称</th>
                        <th>电话</th>
                        <th>备用电话</th>
                        <th>得分</th>
                        <th>地址</th>
                        <th>营业状态</th>
<!--                        <th>营业时间</th>-->
                        <th>审核标记</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item:${list}">
                        <td><label class="timo-checkbox"><input type="checkbox" th:value="${item.shopId}">
                            <i class="layui-icon layui-icon-ok"></i></label></td>
                        <td th:text="${item.shopName}">店铺名称</td>
                        <td th:text="${item.shopTypeName}">店铺类型</td>
                        <td th:text="${item.contactsName}">联系人名称</td>
                        <td th:text="${item.phone}">电话</td>
                        <td th:text="${item.sparePhone}">备用电话</td>
                        <td th:text="${item.score==null||item.score==''?0:item.score}">得分</td>
                        <td th:text="${item.address}">地址</td>
                        <td th:text="${item.openingStatus == '1'?'休息中':'营业中'}">营业状态</td>
<!--                        <td th:text="${item.openingHours}">营业时间</td>-->
                        <td th:text="${item.auditMark== '0' || item.auditMark == null ? '待审核': (item.auditMark == '1'?'审核通过':'审核不通过')}">审核标记</td>
                        <td>
                            <a class="open-popup" data-title="关联人员" th:attr="data-url=@{'/shopsService/shops/relatedUser/'+${item.shopId}}"  data-size="auto" href="#">关联人员</a>
                            <a class="open-popup" data-title="编辑店铺" th:attr="data-url=@{'/shopsService/shops/edit/'+${item.shopId}}" data-size="auto" href="#">编辑</a>
                            <a class="open-popup" data-title="店铺详情编辑" th:attr="data-url=@{'/shopsService/shops/editShopDetails/'+${item.shopId}}" data-size="40-70" href="#">店铺详情</a>
                            <a class="open-popup" data-title="详细信息" th:attr="data-url=@{'/shopsService/shops/detail/'+${item.shopId}}" data-size="800,600" href="#">详细</a>
                            <a class="ajax-get" data-msg="您是否确认删除" th:href="@{'/shopsService/shops/delete/'+${item.shopId}}">删除</a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <div th:replace="/common/fragment :: page"></div>
        </div>
    </div>
<script th:replace="/common/template :: script"></script>
<script th:inline="javascript">
    layui.config({
        base: '/lib/layui-v2.5.7/mods/ajaxCascader/'
        ,version: '1.6'
    });
    layui.use(['jquery','ajaxCascader','layer'],function(){
        var $ = layui.jquery;
        var cascader = layui.ajaxCascader;
        var layer = layui.layer;
        var msg = [[${msg}]];
        if(msg){
            layer.msg(msg);
        }
        // Ajax传参模式
        cascader.load({
            elem: '#demo1'
            ,height: 38
            ,search: {
                show: true,
                minLabel: 5,
                placeholder: '点击选择位置'
            }
            ,clear: true
            ,showlast:true
            ,value: 0
            ,getChildren: function(value,callback){
                var data = []
                $.ajax({
                    url:'/shopsService/shops/getAreaData/'+value,
                    async:false,
                    type:'get',
                    success:function(res){
                        data = res.data;
                        for(var i in data){
                            data[i].value = data[i].id;
                            data[i].label = data[i].name;
                            delete data[i].id;
                            delete data[i].name;
                            if(data[i].level==2){
                                data[i].hasChild = false;
                            }else {
                                data[i].hasChild = true;
                            }

                        }
                        callback(data);
                    }
                });
            },
        });
        var areaId = [[${areaId}]];
        if (areaId){
            $.ajax({
                url: '/shopsService/shops/getMyAreaData/' + areaId,
                type: 'get',
                async : false,
                success: function (res) {

                    $("input[class='layui-input cascader-input']").val( res.data[0].wholeName.replace(/，/g,""))
                }
            })
        }

        $("#searchBtn").click(function () {
            var shopName = $("input[name='shopName']").val();
            var areaIds = cascader.getChooseData('#demo1');
            window.location.href="/shopsService/shops/index?shopName="+shopName+"&areaId="+(areaIds.length==0?'':areaIds[areaIds.length-1]);
        })
        $("#refreshBtn").click(function () {
            window.location.href="/shopsService/shops/index";
        })
    })
</script>
</body>
</html>
